<template>
	<view>
		<view class="tab">
			<view class="video_tab_title">
				<view class="title_inner">
					<uni-segmented-control :current="current" :values="items.map((item,i)=> item.title)" @clickItem="onClickItem" style-type="text" active-color="#f92672"></uni-segmented-control>
				</view>
				<view class="search iconfont icon-xinaixin"></view>
			</view>
			<view class="home_tab_content">
				<view class="content">
				    <view v-if="current < 4">
				       <video-main :urlobj="{url: items[current].url,params: items[current].params}"></video-main>
				    </view>
				    
					<view v-if="current === 4">
					   <video-cate :urlobj="{url: items[current].url,params: items[current].params}"></video-cate>
					</view>
				</view>
			</view>
		</view>
		
		
		        
	</view>
</template>

<script>
	//引入ui
	import {uniSegmentedControl} from '@dcloudio/uni-ui'
	// 引入组件
    import videoMain from "./video-main/video-main.vue"
	import videoCate from "./video-cate/video-cate.vue"
	export default {
		data() {
			return {
				items: [
					{
					title: '推荐',
					url: 'http://157.122.54.189:9088/videoimg/v1/videowp/featured',
					params: {limit: 30,skip: 0,order: "hot"}
				    },
					{
					title: '娱乐',
					url: 'http://157.122.54.189:9088/videoimg/v1/videowp/category/59b25abbe7bce76bc834198a',
					params: {limit: 30,skip: 0,order: "new"}
				    },
					{
					title: '最新',
					url: 'http://157.122.54.189:9088/videoimg/v1/videowp/videowp',
					params: {limit: 30,skip: 0,order: "new"}
				    },
					{
					title: '热门',
					url: 'http://157.122.54.189:9088/videoimg/v1/videowp/videowp',
					params: {limit: 30,skip: 0,order: "hot"}
				    },
					{
					title: '分类',
					url: 'http://157.122.54.189:9088/videoimg/v1/videowp/featured',
					params: {}
					},
				],
				current: 0
			}
		},
		components: {
			uniSegmentedControl,
			videoMain,
			videoCate

		},
		methods: {
			onClickItem(e) {
			            if (this.current !== e.currentIndex) {
			                this.current = e.currentIndex;
							console.log(e)
							uni.setNavigationBarTitle({
								title: this.items[this.current].title
							})
			            }
			        }
		},
		onLoad() {
			
		}
	}
</script>

<style lang="scss" scoped>
.tab {
	.video_tab_title {
		position: relative;
			
		.title_inner {
			width: 60%;
			margin: 0 auto;
		}
		.search {
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			right: 5%;
		}
		
	}
}
</style>
